<template>
	<view class="xin">
	 <scroll-view scroll-y="true"  class="xin-it">
	 	<view class="box">
	 		<text>姓名:</text>
	 			<input class="uni-input" v-model="from.name" focus placeholder="请输入姓名" />
	 	</view>
	 	<view class="box">
	 		<text>身份证:</text>
	 			<input class="uni-input" v-model="from.token" focus placeholder="请输入身份证" />
	 	</view>
	 	<view class="box">
	 		<text>手机号:</text>
	 			<input class="uni-input" v-model="from.tel" focus placeholder="请输入手机号" />
	 	</view>
	 	<view class="box">
	 		<text>现居地址:</text>
	 			<input class="uni-input" v-model="from.zhi" focus placeholder="请选择现居地址" />
	 	</view>
	 	<view class="box">
	 		<text>现居详细地址:</text>
	 			<input class="uni-input" v-model="from.zhiall" focus placeholder="请输入现居详细地址" />
	 	</view>
	 	<view class="box">
	 		<text>疫苗人群分类:</text>
	 			<input class="uni-input" v-model="from.zhiall" focus placeholder="请选择疫苗人群分类" />
	 	</view>
	 </scroll-view>
	  <!-- 提交预约 -->
	  <view class="foot">
	  	<button type="warn">取消</button>
	  	<button type="primary">提交预约</button>
	  </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				from:{
					name:'',
					token:'',
					tel:'',
					zhi:'',
					zhiall:''
				}
			};
		}
	}
</script>

<style lang="scss">
	.foot{
		display: flex;
		align-items: center;
		height: 100rpx;
		button{
			width: 50%;
		}
	}
	.xin-it{
		height: calc(100vh - 100rpx);
	}
.xin{
	padding: 30rpx;
	.box{
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1px solid #ccc;
		 height: 120rpx;
		.uni-input{
			padding-left: 50rpx;
		}
	}
}
</style>
